<template>
  <div v-loading='loading'>
    <modelFilter @setModelData="setModelData" @setModelTableLoading="setModelTableLoading" @tablePage='tablePage'></modelFilter>
    <model-table :modelData="modelData"  v-show="modelTableShow" @tablePage='tablePage'></model-table>
  </div>
</template>

<script>
import modelFilter from "@/components/model/modelFilter"
import modelTable from "@/components/model/modelTable"

export default {
  name: 'ModelManager',
  data(){
    return {
      loading:false,
      filterShow: false,
      modelTableShow:false,
      modelData:{
        currentPage:1,
        total:0,
        headerList:[],
        headerWidth:{},
        modelList:[],
        modelIdList:[]
      }
    };
  },
  methods:{
    setModelData(modelData){ 
        this.modelData=modelData;
        console.log(modelData)
        this.loading=false;
      },
    setModelTableLoading(){
      this.modelTableShow=true;
      this.loading=true;
    },
    tablePage(currentPage){
      this.loading=true;

      var params = new URLSearchParams();
      for(var i=0;i<this.modelData.headerList.length;i++){
        params.append('keyIds', this.modelData.headerList[i].keyId); 
      }
      params.append("modelIds",this.modelData.modelIdList);
      params.append("currentPage",currentPage);

      this.$http.post(this.$store.state.url+'/modelfilterbyid',params).then(
        response=>{
          if(response.data.status==200){
            this.modelData=response.data.data;
          }else{
            this.modelData.modelList=[];
          }
          this.loading=false;
        }
      ).catch(
        error=>{

        }
      );
    }
  },
  components:{
      modelFilter:modelFilter,
      modelTable:modelTable
  }
}
</script>

<style scoped>

</style>
